<template>
  <div class="h-panel">
    <PaasTitleBar></PaasTitleBar>
    <div class="h-panel-body bottom-line">
      <Form ref="form" :validOnChange="true" :showErrorTip="true" labelPosition="true" :labelWidth="110" :rules="vRules" :model="model" mode="twocolumn">
        <FormInput label="账号" prop="account" v-model="model.account"></FormInput>
        <FormInput type="password" label="用户密码" prop="pass" v-model="model.pass" v-show="action == 'add'"></FormInput>
        <FormInput type="password" label="确认密码" prop="pass" v-model="pass" v-show="action == 'add'"></FormInput>

        <FormInput label="姓名" prop="name" v-model="model.name"></FormInput>
        <FormInput label="手机号" prop="phone" v-model="model.phone"></FormInput>
        <FormInput label="邮箱" prop="email" v-model="model.email"></FormInput>
        <FormSelect label="性别" prop="sex" v-model="model.sex" params="Sex"></FormSelect>
        <FormInput label="年龄" prop="age" v-model="model.age"></FormInput>
        <FormPageSelect label="角色权限" prop="roleId" v-model="model.roleId" url="/sysroles/select"></FormPageSelect>
      </Form>
    </div>
    <PaasButtonBar></PaasButtonBar>
  </div>
</template>
<script>
import Sm3 from "crypto-api/src/hasher/sm3";
import { toHex } from "crypto-api/src/encoder/hex";

export default {
  computed: {
    action() {
      return this.$store.state.forms.action;
    },
  },
  async mounted() {
    let id = this.$route.query.id;
    if (!!id) {
      this.model = await this.$store.dispatch("getFormData", id);
    }
  },
  data() {
    return {
      pass: "",
      model: {
        account: "",
        pass: "",
        name: "",
        phone: "",
        email: "",
        sex: "",
        age: "",
        roleId: "",
      },
      vRules: {
        required: ["account", "name", "phone", "roleId"],
      },
    };
  },
  methods: {
    validate() {
      if (this.action == "add") {
        if (this.model.pass == "" || this.model.pass != this.pass) {
          this.pass = "";
          this.$Message.error("输入密码有误，请重新输入");
          return false;
        }
        let sm3 = new Sm3();
        sm3.update(this.model.pass);
        this.model.pass = toHex(sm3.finalize()).toUpperCase();
      } else {
      }
      return true;
    },
  },
  deactivated() {
    this.$destroy(true);
  },
};
</script>